<template>
  <div >
    <div class="py-container index">
      <!--banner-->
      <div class="banner">
        <img
          src="../../public/img/_/banner.png"
          class="img-responsive"
          alt=""
        />
      </div>
      <!--秒杀时间-->
      <div class="sectime">
        <div class="item-time active">
          <div class="time-clock">12:00</div>
          <div class="time-state-on">
            <span class="on-text">快抢中</span>
            <span class="on-over">距离结束：01:02:34</span>
          </div>
        </div>
        <div class="item-time">
          <div class="time-clock">14:00</div>
          <div class="time-state-will">
            <span>即将开始</span>
          </div>
        </div>
        <div class="item-time">
          <div class="time-clock">16:00</div>
          <div class="time-state-will">
            <span>即将开始</span>
          </div>
        </div>
        <div class="item-time">
          <div class="time-clock">18:00</div>
          <div class="time-state-will">
            <span>即将开始</span>
          </div>
        </div>
        <div class="item-time">
          <div class="time-clock">20:00</div>
          <div class="time-state-will">
            <span>即将开始</span>
          </div>
        </div>
      </div>
      <!--商品列表-->
      <div class="goods-list" id="app">
        <ul class="seckill" id="seckill">
          <li class="seckill-item" v-for="item in goodslist" :key="item">
            <div class="pic">
              <img src="../../public/img/_/list.jpg" alt="" />
            </div>
            <div class="intro">
              <span>{{ item.intro }}</span>
            </div>
            <div class="price">
              <b class="sec-price">￥{{ item.newprice }}</b>
              <b class="ever-price">￥{{ item.oldprice }}</b>
            </div>
            <div class="num">
              <div>已售{{ item.rate }}</div>
              <div class="progress">
                <div class="sui-progress progress-danger">
                  <span style="width: 70%;" class="bar"></span>
                </div>
              </div>
              <div>
                剩余 <b class="owned">{{ item.left }}</b
                >件
              </div>
            </div>
            <a
              class="sui-btn btn-block btn-buy"
              href="seckill-item.html"
              target="_blank"
              >立即抢购</a
            >
          </li>
        </ul>
      </div>
      <div class="cd-top">
        <div class="top">
          <img src="../../public/img/_/gotop.png" />
          <b>TOP</b>
        </div>
        <div class="code" id="code">
          <span>
            <img src="../../public/img/_/code.png" />
          </span>
        </div>
        <div class="erweima">
          <img src="../../public/img/_/erweima.jpg" alt="" />
          <s></s>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      goodslist: [
        {
          intro: 'Apple苹果iPhone 6s 32G金色 移动联通电信4G手机',
          newprice: '6088',
          oldprice: '6988',
          rate: '87%',
          left: '29'
        },
        {
          intro: 'Apple苹果iPhone 6s 32G金色 移动联通电信4G手机',
          newprice: '6088',
          oldprice: '6988',
          rate: '87%',
          left: '29'
        },
        {
          intro: 'Apple苹果iPhone 6s 32G金色 移动联通电信4G手机',
          newprice: '6088',
          oldprice: '6988',
          rate: '87%',
          left: '29'
        },
        {
          intro: 'Apple苹果iPhone 6s 32G金色 移动联通电信4G手机',
          newprice: '6088',
          oldprice: '6988',
          rate: '87%',
          left: '29'
        },
        {
          intro: 'Apple苹果iPhone6 s 32 G金色 移动联通电信4G手机 ',
          newprice: '6088 ',
          oldprice: '6988 ',
          rate: '87 % ',
          left: '29 '
        },
        {
          intro: 'Apple苹果iPhone 6 s 32 G金色 移动联通电信4G手机 ',
          newprice: '6088',
          oldprice: '6988',
          rate: '87%',
          left: '29'
        },
        {
          intro: 'Apple苹果iPhone 6s 32G金色 移动联通电信4G手机',
          newprice: '6088',
          oldprice: '6988',
          rate: '87%',
          left: '29'
        }
      ]
    }
  }
}
</script>
<style lang="less"></style>
